/**
 * 无缝轮播（seamlessSlide）
 * @authors Your Name (you@example.org)
 * @date    2018-04-16 21:39:04
 * @version $Id$
 */

var $banner = $("#banner1"),
	$pic = $banner.find(".pic ul li"),
	$tab = $banner.find(".tab ul li"),
	$btn = $banner.find(".btn div"),
	length = $pic.length,
	index = 0;

<!-- 初始显示 -->
$banner[0].onselectstart=function(){
	return false;
};
var $picUl = $pic.parent(),
	width = $pic.width();

$picUl.prepend($pic.last().clone(true,true));
$picUl.append($pic.first().clone(true,true));
$picUl.width((length+10)*width).css({"marginLeft":-width}).parent().css({"overflow":"hidden"});
$pic = $picUl.children();

$pic.css({
	position:"static",
	width:width,
	float:"left"
});
$tab.eq(0).addClass("on");

<!-- tab -->
$tab.click(function(){
	var x = index;
	if(x !== $(this).index()){
		change($(this).index());
	}
});

<!-- btn -->
$btn.click(function(){
	var x = index;
	if($(this).index()){
		x++;
	}else{
		x--;
	}
	change(x);
});

<!-- 自动轮播 -->
$banner.hover(function(){
	clearInterval(tabTime);
},run());
function run(){
	tabTime = setInterval(function (){
		var x = index;
		x++;
		change(x);
	},3000);
	return run;
}

<!-- 变化函数 -->
function change(i){
	var num = i;
	$tab.eq(index).removeClass('on');
	i %= length;
	i = i<0?length-1:i;
	index = i;
	$picUl.stop().animate({
		marginLeft : -(num + 1)*width
	},500,function(){
			if(index === 0 || index === length-1){
				$picUl.css({"marginLeft":-(index+1)*width});
			}
		});
	$tab.eq(index).addClass('on');
}

